﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	
	<title>Smooth Animated jQuery Menu</title>
	
	<link rel="stylesheet" href="animated-menu.css"/>
	
	<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.js" type="text/javascript"></script>
	<script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
	<script src="animated-menu.js" type="text/javascript"></script>
</head>

<body>

	<p>Rollover a menu item to expand it.</p>
    <div>
        <ul>
            <li class="green">
                <p><a href="#">Home</a></p>
                <p class="subtext">The front page</p>
                <p class="subtext">The front page</p>
                <p class="subtext">The front page</p>
                <p class="subtext">The front page</p>
                <p class="subtext">The front page</p>
            </li>
            <li class="yellow">
                <p><a href="#">About</a></p>
                <p class="subtext">More info</p>
            </li>
            <li class="red">
                <p><a href="#">Contact</a></p>
                <p class="subtext">Get in touch</p>
            </li>
            <li class="blue">
                <p><a href="#">Submit</a></p>
                <p class="subtext">Send us your stuff!</p>
            </li>
            <li class="purple">
                <p><a href="#">Terms</a></p>
                <p class="subtext">Legal things</p>
            </li>
        </ul>
    </div>
	
</body>
</html>
